<template>
  <div class="app-container  bg-gray">
    <el-tabs id="site" type="border-card" class="box-1">
      <el-tab-pane label="年假配置">
        <el-form ref="annualLeaveForm" :model="annualLeaveForm" label-width="180px">
          <el-form-item label="年假天数">
            <el-alert :closable="false" title="初始年假天数" type="info"/>
            <el-input-number v-model="annualLeaveForm['day_count']"/>
          </el-form-item>
          <el-form-item label="每年增加">
            <el-alert :closable="false" title="按入职时间计算，每12月增加XX天" type="info"/>
            <el-input-number v-model="annualLeaveForm['year_add']"/>
          </el-form-item>
          <el-form-item label="最高天数">
            <el-alert :closable="false" title="公司最高年假天数" type="info"/>
            <el-input-number v-model="annualLeaveForm['max_day']"/>
          </el-form-item>
          <el-form-item label="计算规则">
            <el-alert :closable="false" title="入职后满XX月产生初始年假" type="info"/>
            <el-input-number v-model="annualLeaveForm['rule']"/>
          </el-form-item>
          <el-form-item label="年假失效">
            <el-alert :closable="false" title="年后XX月失效" type="info"/>
            <el-input-number v-model="annualLeaveForm['day_lapse']"/>
          </el-form-item>
          <el-form-item v-if="isReadOnly">
            <div>此站点为测试站点,测试用户无法进行修改</div>
          </el-form-item>
          <div v-else style="text-align:center">
            <el-button type="primary" class="bg-green" @click="submitForm('annualLeaveForm')">提交</el-button>
          </div>
        </el-form>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        // 是否开源站点只读
        isReadOnly: false,

        // 年假设置
        annualLeaveForm: { day_count: '', year_add: '', max_day: '', rule: '', day_lapse: ''}
      }
    },
    created() {
      this.getSiteConfig();
    },
    methods: {
      /**
       *  获取站点数据
       *  接口:'siteconfig/list'
       */
      getSiteConfig() {
        const url = 'annualLeave/get';
        this.$store.dispatch('GetConnect', { url }).then(res => {
          this.id = res.data.id;
          this.annualLeaveForm = res.data;
        }).catch(e => {
          this.$message.error(e.msg + ',请刷新或联系管理员');
        })
      },
      /**
       * 表单提交
       * 添加客户
       */
      submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            let url = 'annualLeave/update/';
            let data = {};
            if (formName === 'annualLeaveForm') {
              Object.assign(data, this.annualLeaveForm);
              url = url + this.annualLeaveForm.id
            } else if (formName === 'qywxForm') {
              data = this.qywxForm;
              Object.assign(data, this.qywxForm);
              data.type = 'qy';
            } else if (formName === 'adminWxAppForm') {
              data = this.adminWxAppForm;
              data.type = 'adminWxAppForm';
            } else if (formName === 'agentWxAppForm') {
              data = this.agentWxAppForm;
              data.type = 'agentWxAppForm';
            } else if (formName === 'wxPayForm') {
              data = this.wxPayForm;
              data.type = 'pay';
            } else if (formName === 'bonusForm') {
              data = this.bonusForm;
              data.type = 'bonusLimit';
            } else if (formName === 'capitalForm') {
              data = this.capitalForm;
              data.type = 'royaltyLimit';
            } else if (formName === 'userAgreementForm') {
              data = this.userAgreementForm;
              data.type = 'agreement';
            } else if (formName === 'privacyAgreementForm') {
              data = this.privacyAgreementForm;
              data.type = 'privacy';
            }
            this.$store.dispatch('GetConnect', { url, data }).then(res => {
              this.$message.success(res.msg);
              this.getSiteConfig();
            }).catch(e => {
              this.$message.error(e.msg);
            })
          } else {
            this.$message.error('提交失败,请检查必填项');
          }
        })
      }
    }
  }
</script>

<style lang="scss" type="text/scss" scoped>
  @import '../../../styles/index.scss';
  .box-1 {
    max-width: 1000px;
    margin: 0 auto;
    .el-form {
      max-width: 900px;
      .el-alert{
        padding: 0 5px;
        width: 360px;
      }
    }
  }

  .dialog {
    .el-input {
      width: 80%;
    }
  }
</style>

<style>
  #site .el-tabs__nav-wrap {
    background-color: #304156;
  }
</style>
